<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>消防周报</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, viewport-fit=cover">
<meta name="Copyright" content="">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<!-- 禁用链接高亮 -->
<meta name="theme-color" content="#2196f3">
<link rel="stylesheet" href="../../../css/framework7.min.css">
<style type="text/css">
ul{
padding: 0;
}
a{text-decoration:none;}ol,li{margin:0;padding:0}li{list-style-type:none}#date-wrapper{position:fixed;top:50%;left:50%;width:90%;margin: -139px 0 0 -45%;z-index:56;text-align:center;background:#fff;border-radius:3px;padding-bottom:15px;display:none}#d-mask{position:fixed;width:100%;height:100%;top:0;left:0;background:#000;filter:alpha(Opacity=50);-moz-opacity:.5;opacity:.5;z-index:55;display:none}#date-wrapper h3{line-height:50px;background:#79c12f;color:#fff;font-size:20px;margin:0;border-radius:3px 3px 0 0}#date-wrapper ol,#d-tit>div{width:16.6666666%;float:left;position:relative}#d-content{padding:10px}#d-content #d-bg{background:#f8f8f8;border:1px solid #e0e0e0;border-radius:0 0 5px 5px;height:120px;overflow:hidden;margin-bottom:10px;position:relative}#d-cancel,#d-confirm{border-radius:3px;float:left;width:40%;line-height:30px;font-size:16px;background:#dcdddd;color:#666;margin:0 5%}#d-confirm{background:#79c12f;color:#fff}#date-wrapper li{line-height:40px;height:40px;cursor:pointer;position:relative}#d-tit{background:#f8f8f8;overflow:hidden;border-radius:5px 5px 0 0;line-height:30px;border:1px solid #e0e0e0;margin-bottom:-1px}#date-wrapper ol{-webkit-overflow-scrolling:touch;position:absolute;top:0;left:0}#date-wrapper ol:nth-child(2){left:16.6666666%}#date-wrapper ol:nth-child(3){left:33.3333332%}#date-wrapper ol:nth-child(4){left:49.9999998%}#date-wrapper ol:nth-child(5){left:66.6666664%}#date-wrapper ol:nth-child(6){left:83.333333%}#d-content #d-bg:after{content:'';height:40px;background:#ddd;position:absolute;top:40px;left:0;width:100%;z-index:1}#date-wrapper li span{position:absolute;width:100%;z-index:99;height:100%;left:0;top:0}#date-wrapper.two ol,.two #d-tit>div{width:50%}#date-wrapper.two ol:nth-child(2){left:50%}#date-wrapper.three ol,.three #d-tit>div{width:33.333333%}#date-wrapper.three ol:nth-child(2){left:33.333333%}#date-wrapper.three ol:nth-child(3){left:66.666666%}#date-wrapper.four ol,.four #d-tit>div{width:25%}#date-wrapper.four ol:nth-child(2){left:25%}#date-wrapper.four ol:nth-child(3){left:50%}#date-wrapper.four ol:nth-child(4){left:75%}#date-wrapper.five ol,.five #d-tit>div{width:20%}#date-wrapper.five ol:nth-child(2){left:20%}#date-wrapper.five ol:nth-child(3){left:40%}#date-wrapper.five ol:nth-child(4){left:60%}#date-wrapper.five ol:nth-child(5){left:80%}#date-wrapper.hms #d-hours{left:0;}#date-wrapper.hms #d-minutes{left:33.333333%;}#date-wrapper.hms #d-seconds{left:66.666666%;}#date-wrapper.hm #d-hours{left:0;}#date-wrapper.hm #d-minutes{left:50%;}
.page {
	overflow: hidden;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	box-sizing: border-box;
	background-color: #fff;
}

.page-content {
    overflow-x: hidden;
    box-sizing: border-box;
    height: 100%;
    position: relative;
    z-index: 1;
    padding: 70px 15px 30px 15px;
    background:rgba(251,251,251,1);
}
.singleWeekly-page .link-page-top{
    position: absolute;
    top: -2px;
    left: 0;
    z-index: 9;
    width: calc(100% - 40px);
    background-color: #fff;
    padding: 10px 20px;
    padding-bottom: 0;
}
.singleWeekly-page .link-page-title {
    font-size: 24px;
    color: #000000;
    background-color: white;
    font-weight: bold;
    width: 70%;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.singleWeekly-page .link-page-top .link-date {
	font-size: 14px;
	font-weight: 400;
	color: rgba(74, 133, 207, 1);
	line-height: 25px;
	margin-right: 50px;
	word-wrap: break-word;
}
.singleWeekly-page .pageContent{
    position: relative;
    overflow-x: hidden;
	
}
.singleWeekly-page .weeklyTime {
	font-size: 14px;
	color: #4A85CF;
	display: block;
}
.singleWeekly-page ul.dataContent {
	background: rgba(251,251,251,1);
	margin-top: 20px;
}

.singleWeekly-page ul.dataContent li.item {
	background: #fff;
	border: 1px solid rgba(225, 225, 225, 0.4);
	box-shadow: 0px 0px 15px 0px rgba(205, 205, 205, 0.2);
	border-radius: 10px;
	padding: 20px 10px;
	margin-bottom: 20px;
}

.singleWeekly-page ul.dataContent li .item-tt {
	font-size: 18px;
	font-weight: bold;
	color: #444444;
	margin: 0 0 20px 2px;
	line-height: 18px;
}

.singleWeekly-page ul.dataContent li .securityChars {
	width: 100%;
	height: auto;
}

.singleWeekly-page ul.dataContent li .securityChars div.chartLineView {
	width: 12%;
	height: auto;
	float: left;
	text-align: center;
}

.singleWeekly-page ul.dataContent li .securityChars div.chartLineView p{
	margin-bottom: 25px;
	font-size: 10px;
	color: #999999;
	line-height: 10px;
	margin-top: 0;
}

.singleWeekly-page ul.dataContent li .securityChars div.chartLineView .item-hour
	{
	width: 100%;
	height: auto;
	margin-bottom: 13px;
}

.singleWeekly-page ul.dataContent li .securityChars div.chartLineView .item-hour div
	{
	width: 15px;
	height: 4px;
	background: #75CD7E;
	border-radius: 2px;
	display: block;
	margin: 0px auto 5px auto;
}

.singleWeekly-page ul.dataContent li .charsStatistics {
	display: inline-block;
	width: 100%;
	position: relative;
}

.singleWeekly-page ul.dataContent li .charsStatistics .charsStatistics-item{
	width: 33%;
	text-align: center;
	float:left;
	height: 92px;
}

.singleWeekly-page ul.dataContent li .charsStatistics .charsStatistics-item .chart{
	width: 100%;
	height: 64px;
}
.singleWeekly-page ul.dataContent li .charsStatistics .charsStatistics-item .centerValue{
	width: 33.3%;
	height: 64px;
	position: absolute;
    top: 0px;
}
.singleWeekly-page ul.dataContent li .charsStatistics .charsStatistics-item .centerValue span{
	font-size: 15px;
	color:#444;
	width: 100%;
    display: block;
    line-height: 18px;
    padding-top: 12px;
    font-weight: bold;
}
.singleWeekly-page ul.dataContent li .charsStatistics .charsStatistics-item .centerValue label{
	font-size: 10px;
	color:#999;
	width: 100%;
    display: block;
}
.singleWeekly-page ul.dataContent li .charsStatistics .charsStatistics-item p{
	margin-top: 9px;
}

.singleWeekly-page #deviceView li{
	background:#f9f9f9;
	margin-top: 2%;
	padding: 20px 10px;
	display: inline-flex;
    width: calc(100% - 20px);
	display: inline-flex;
    align-items: center;
}

.singleWeekly-page #deviceView li .devicePre{
	font-size:32px;
	color:#2E76CA;
	width: 44%;
	line-height: 62px;
}

.singleWeekly-page #deviceView li .deviceContent{

}

.singleWeekly-page #deviceView li .devicePre label{
	font-size: 16px;
}

.singleWeekly-page #deviceView li .deviceName{
	font-size:15px;
	color:#333333;
	line-height: 15px;
}
.singleWeekly-page #deviceView li .deviceNum{
	font-size:12px;
	color:#999999;
	margin-top: 9px;
}

.singleWeekly-page .policeView{
	margin-bottom: 60px;
}

.singleWeekly-page .policeTt{
	font-size:15px;
	color:#333333;
	line-height: 15px;
	vertical-align:middle;
	margin-left: -4px;
}
.singleWeekly-page .policeView .policeChart{
	width: 100%;
	height: 171px;
}
.singleWeekly-page .policeDeil{
	margin-top: 14px;
	width: 100%;
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.singleWeekly-page .policeDeil .policeDeil-item{
	background:#f9f9f9;
	width: 49%;
	margin-top: 2%;
}
.singleWeekly-page .policeDeil .policeDeil-item>div{
	padding: 10px;
}
.singleWeekly-page .policeDeil .policeDeil-item div{
	font-size:12px;
	color:#999;
}
.singleWeekly-page .policeDeil .policeDeil-item div span{
	float:right;
}
.singleWeekly-page .policeDeil .policeDeil-item .policeDeil-item-tt{
	font-size:14px;
	font-weight:600;
	margin-bottom: 13px;
}
.singleWeekly-page .maintainInspectView{
	margin-bottom: 44px;
}

.singleWeekly-page .maintainInspectView .maintainInspectChart{
	width: 50%;
	height: 150px;
	display: inline-block;
}

.singleWeekly-page .maintainInspectView .notFinished{
	width: 44%;
	margin-left: 3%;
	background:#f9f9f9;
	display: inline-block;
}
.singleWeekly-page .maintainInspectView .notFinishedTt{
	margin:26px 15px 12px 15px;
	color: #000;
	font-size: 14px;
}
.singleWeekly-page .maintainInspectView .notFinishedDay{
	color: #2E76CA;
	font-size: 34px;
	margin-left: 15px;	
	line-height: 34px;
}
.singleWeekly-page .maintainInspectView .notFinishedDay label{
	font-size: 14px;
}
.singleWeekly-page .maintainInspectView .notFinishedDec{
	color: #999;
	font-size: 12px;
	margin: 28px 15px 20px 15px;
}
.singleWeekly-page .maintainInspectView .maintainInspectDetail{
	margin-top: 26px;
}
.singleWeekly-page .troubleView{
	margin-bottom: 41px;
}
.singleWeekly-page .troubleDetail{
	margin-top: 34px;
}
.singleWeekly-page .troubleDetail .troubleNum div{
	width: 44%;
	height: auto;
	display: inline-block;
	color: #999;
	font-size: 14px;
	text-align: center;
}
.singleWeekly-page .troubleDetail .troubleNum div span{
	font-size:34px;
	color: #333333;
	line-height: 34px;
}

.link-image-groups{
    text-align: left;
}
.pic-item {
	text-align: center;
	margin: 15px 0px;
}
#controlRoomPic img{
	max-width: 100%;
}
.pic-item .image-item ,.pic-item img {
	width: 30%;
	height: 70px;
	display: inline-block;
}
.only-one-item img{
	width: 100%;
  height: 150px;
}

.pic-item .image-item ,.pic-item img {
	margin-right: 2%;
}

.singleWeekly-page .troubleDetail .troubleDec{
	text-align: center;
	font-size:12px;
	color: #999;
	background:rgba(249,249,249,1);
	border-radius:2px;
	height: 34px;
	line-height: 34px;
}
.singleWeekly-page .maintainView{
	margin-bottom: 47px;
}
.singleWeekly-page .maintainDetail{
	margin-top: 25px;
}
.singleWeekly-page .maintainDetail .maintainlegend{
	width: 100%;
	text-align: center;
	margin-bottom: 25px;
	font-size:12px;
	color:rgba(153,153,153,1);
}
.singleWeekly-page .maintainDetail .maintainlegend i{
	width: 10px;
	height: 10px;
	background-color: #5B96DC;
	display: inline-block;
	margin-right: 3px;
}
.singleWeekly-page .maintainDetail .maintanSys{
	margin-bottom: 16px;
	width: calc(100% - 6px);
	font-size: 12px;
	line-height: 12px;
	display: inline-flex;
	justify-content: space-between;
	margin-left: 6px;
}
.singleWeekly-page .maintainDetail .maintanSys span{
	color: #999;
	width: 50%;
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.singleWeekly-page .maintainDetail .maintanSys div{
	/* display: inline-block;
	width: 50%;
	height: 10px;
	border-radius:5px; */
}
.singleWeekly-page .maintainDetail .maintanSys label{
	color: #333;
	width: 15%;
	text-align:right;
	display: inline-block;
}

.singleWeekly-page .controlRoomDetail{
	margin-top: 19px;
}
.singleWeekly-page .controlRoomDetail .roomInfo{
	text-align: center;
}
.singleWeekly-page .controlRoomDetail  p{
	font-size:12px;
	color:#999;
	line-height: 12px;
	margin-bottom: 11px;
}
.singleWeekly-page .controlRoomDetail .roomInfo span{
	color: #333;
	font-size: 24px;
	line-height: 24px;
}

.singleWeekly-page .controlRoomDetail .videoPic{
	width: 100%;
	height: 160px;
	background-color:#e1e1e1;
	margin-top: 22px;
	margin-bottom: 11px;
}
.singleWeekly-page .dutyDetail{
	margin-top: 14px;
}

.singleWeekly-page .dutyDetail .dutyInfo div{
	width: 48%;
	height: 78px;
	text-align: center;
	background-color: #f9f9f9;
	display: inline-block;
	margin-bottom: 10px;
}
.singleWeekly-page .dutyDetail .dutyInfo div p{
	font-size: 14px;
	color: #A5A5A5;
	line-height: 14px;
	margin-top: 14px;
	padding-bottom: 8px;
}

.singleWeekly-page .dutyDetail .dutyInfo div span{
	font-size: 24px;
	margin-top:12px;
	line-height: 24px;
}
.singleWeekly-page .dutyTable{
	border-bottom:1px solid #e1e1e1;
	width: 100%;
	margin-top: 7px;
	margin-bottom: 30px;
}
.singleWeekly-page .dutyTable span{
	height: 26px;
	font-size: 12px;
	line-height: 26px;
	padding: 0;
	margin:0;
	display: inline-block;
	border-top:1px solid #e1e1e1;
	border-left: 1px solid #e1e1e1;
	width: 19.9%;
	text-align: center;
	margin-left: -5px;
}
.singleWeekly-page .dutyTable .tableTitle{
	margin-left: 3px;
}
.singleWeekly-page .dutyTable .tableTitle div{
	color: #999;
}

.singleWeekly-page .dutyTable .tableBody{
	margin-left: 3px;
}

.singleWeekly-page .dutyTable .tableBody div{
	color: #333;
}
.page-content .voiceView{
	text-align: center;
	padding: 35px 0;
}
.page-content .voiceView img{
	width: 38px;
	height: 53px;
}
.page-content .voiceView p{
	margin-top: 10px;
	line-height: 14px;
	font-size: 14px;
	color:#4F8DD4;
}

/*值班打卡情况*/
.duty-table{
	width: 100%;
	padding: 5px 0px;
}
.duty-table thead tr th{
	padding: 6px 4px;
	font-size: 12px;
	text-align: center;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    color: rgba(153,153,153,1);
    border-bottom:1px solid rgba(225,225,225,0.5);
}
.duty-table tbody tr td{
	padding: 6px 4px;
	font-size:12px;
	text-align: center;
	font-family:PingFangSC-Regular;
	font-weight:400;
	color:rgba(51,51,51,1);
	border-bottom:1px solid rgba(225,225,225,0.5);
}
.link-top-btns{
	position: absolute;
	right:20px;
	top: 10px;
}
.link-page-top img{
	float: left;
    height: 25px;
	width: 25px;
    margin-top: 7px;
}
/* AI云视 */
#aiCloudVideo .bottomCloudVideo{
	position: relative;
	margin-left: calc(44% - 60px);
}
.bottomCloudVideoBox{
	display: inline-flex;
    width: calc(100% - 20px);
    align-items: center;
    padding: 10px;
    background: #f9f9f9;
    margin-top: 2%;
}
.bottomCloudVideoBox>img{
	width: 60px;
	height: 60px;
}
.bottomCloudVideo{
    width: 50%;
	font-size: 14px;
	color: #625454;
}
.bottomCloudVideo p{
	line-height: 10px;
}
.bottomCloudVideo p:nth-child(1){
	color: #333;
}
.bottomCloudVideo p:nth-child(2){
	color: #999;
}
.bottomCloudVideo p span{
	font-size: 14px;
}
</style>
</head>
<body style="overflow: hidden;margin: 0;margin-top: 8px;">
<div id="app" class="page singleWeekly-page" data-page="singleWeekly"
	style="z-index: 2">
	<div class="link-page-top" >
		<div class="link-page-title" id="weeklyTitle">
		</div>
		<div class="link-top-btns">
			<img src="../../../img/share.png" style="margin-right:15px;" id="sharePageBtn" />
			<img src="../../../img/voice.png" id="voiceBtn" />
		</div>
		<div class="link-date" id="weeklyTime"></div>
	</div>
	<div class="page-content" style="overflow-y: auto;">
		<ul class="dataContent" id="dataContent">
		</ul>
	</div>
</div>
<script src="../../../js/plugins/framework_ilink.js"></script>
<!-- 设置配置文件 -->
<script src="/ilink-fe-config/zhxf-app/config.js?v=202005151646"></script>
<!-- jquery-3.3.1.min.js  -->
<script src="/ilink-app-h5-zd/static/js/rdspFile_1559652823179.js"></script>
<!-- moment.js -->
<script src="/ilink-app-h5-zd/static/js/rdspFile_1559652904949.js"></script>
<!-- echarts.min.js -->
<script src="/ilink-app-h5-zd/static/js/rdspFile_1559652961780.js "></script>
<!-- 进度条插件 -->
<script src="/ilink-app-h5-zd/static/js/rdspFile_1559708991242.js"></script>
<!-- 语音播报插件 -->
<script src="/ilink-app-h5-zd/static/js/ilink_1564575847499.js"></script>

<script type="text/javascript">
$(function() {

	var app = new Framework7({
		id: 'ilink',
    version:'',
    root: '#app',
    history:false,
    cache: true,//是否打开 Ajax 缓存。最好启用Ajax缓存，特别是你的页面内容不经常更新的时候。（默认值：true）
    cacheDuration: 1000*60*10,//Ajax 缓存时间，在缓存有效期内加载页面不会发起新的ajax请求而是直接使用缓存的结果。（默认是 10 分钟）
    cacheIgnore:[],//不希望被缓存的URL，这是一个字符串数组。（默认为空数组）
    cacheIgnoreGetParameters:false,//缓存是否忽略get参数，如果为 "true"，那么像 "about.html?id=2" 和 "about.html?id=3" 将会和 "about.html" 是一样的缓存。（默认值：false）
    routes: [],
    touch: {
        tapHold: true, //enable tap hold events
		},
		view:{
      stackPages: true
    },
	});

	//如果是给pc端嵌入
    if (!/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent) && !/(Android)/i.test(navigator.userAgent)) {
        $('#sharePageBtn').hide()
    }
	//接口上下文路径
	var contextPath = CONFIGBOX[CONFIGKEY].proxy;
	var isPlay = false;
	var isresume = false;
	$('#voiceBtn').attr("src", "../../../img/voice.png");
	var id=getQueryVariable("reportId");
	$.ajax({
		url :location.origin+ "/app/maintainReport/getMaintenanceReportDataForShare?id="+id,	
        type : 'get',
        dataType: 'json',
        success : function(data) {
		if (data) {
			var data=JSON.parse(JSON.parse(xxbubs(data.data)));
			var orgName=data.orgName;
			if(orgName)
				$("#weeklyTitle").html(orgName);
			var sTimes=data.startDate;
			var sTimes=data.startDate.split('-');
			var startTimeStr=sTimes[1]+"月"+sTimes[2]+"日"
			var eTimes=data.endDate.split('-');
			var endTimeStr=eTimes[1]+"月"+eTimes[2]+"日";
    		$("#weeklyTime").empty().html(transNullundefinedToline(startTimeStr+"-"+endTimeStr));
			var securitySituation=data.securitySituation;//一周安全态势
			if(securitySituation){
				$("#dataContent").append(`
					<li class="item">
						<p class="item-tt">一周安全态势</p>
						<div class="securityChars" id="securityChars">
							<div class="chartLineView">
								<p>24:00</p>
								<p>20:00</p>
								<p>16:00</p>
								<p>12:00</p>
								<p>08:00</p>
								<p>04:00</p>
							</div>
						</div>
						<div class="charsStatistics">
							<div class="charsStatistics-item">
								<div id="charsStatistics-urgent" class="chart"></div>
								<div class="centerValue">
									<span id="urgentHourView"></span>
									<label>小时</label>
								</div>
								<p><label style="font-szie:12px;color:#FA7C5A">告急</label></p>
							</div>
							<div class="charsStatistics-item">
								<div id="charsStatistics-danger" class="chart"></div>
								<div class="centerValue">
									<span id="dangerHourView"></span>
									<label>小时</label>
								</div>
								<p style="font-szie:12px;color:#FFBC37">危险</p>
							</div>
							<div class="charsStatistics-item">
								<div id="charsStatistics-normal" class="chart"></div>
								<div class="centerValue">
									<span id="securityHourView"></span>
									<label>小时</label>
								</div>
								<p style="font-szie:12px;color:#75CD7E">安全</p>
							</div>
						</div>
					</li>`);
				self.initSecurityChars(securitySituation.dataList);
				var urgentHour=parseFloat(securitySituation.urgentHour);
				var dangerHour=parseFloat(securitySituation.dangerHour);
				var securityHour=parseFloat(securitySituation.securityHour);
				$("#urgentHourView").empty().html(urgentHour);
				$("#dangerHourView").empty().html(dangerHour);
				$("#securityHourView").empty().html(securityHour);
				var aaa=urgentHour/(urgentHour+dangerHour+securityHour)*100;
				self.initPieChart(urgentHour/(urgentHour+dangerHour+securityHour)*100,'charsStatistics-urgent','#FA7C5A');
           	    self.initPieChart(dangerHour/(urgentHour+dangerHour+securityHour)*100,'charsStatistics-danger','#FFBC37');
           	    self.initPieChart(securityHour/(urgentHour+dangerHour+securityHour)*100,'charsStatistics-normal','#75CD7E');
			}
			var equipmentCompleteness=data.equipmentCompleteness;//设备完好性
				if(equipmentCompleteness && equipmentCompleteness.length>0){
					$("#dataContent").append(`
						<li class="item">
							<p class="item-tt">设备完好性</p>
							<ul id="deviceView">
							</ul>
						</li>
					`);
					for(var i=0;i<equipmentCompleteness.length;i++){
						$("#deviceView").append(`
							<li>
								<span class="devicePre">`+equipmentCompleteness[i].progress+`<label>%</label></span>
								<div class="deviceContent">
									<p class="deviceName">`+equipmentCompleteness[i].systemName+`</p>
									<p class="deviceNum">检测总数&nbsp<label style="color:#2E76CA">`+equipmentCompleteness[i].monitorTotal+`</label>&nbsp&nbsp&nbsp&nbsp故障数&nbsp<label style="color:#FFBC37">`+equipmentCompleteness[i].faultTotal+`</label></p>
								</div>
							</li>
						`);
					}
				}
			var changeOfPoliceSituation=data.changeOfPoliceSituation;//接处警回顾
			if(JSON.stringify(changeOfPoliceSituation)!='{}'){
				$("#dataContent").append(`
					<li class="item">
						<p class="item-tt">接处警回顾</p>
						<div class="policeView">
							<p class="policeTt"><img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;">警情数量变化</p>
							<div id="policeChart" class="policeChart">
							</div>
						</div>
						<div>
							<p class="policeTt"><img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;">警情处理</p>
							<div id="policeDeil" class="policeDeil">
							</div>
						</div>
					</li>
				`);
				var thisWeekData=[];
				//var lastWeekData=[];
				for(var times=0;times<changeOfPoliceSituation.thisWeek.length;times++){
					thisWeekData[times]=changeOfPoliceSituation.thisWeek[times].value;
				}
				//for(var times=0;times<changeOfPoliceSituation.lastWeek.length;times++){
				//	lastWeekData[times]=changeOfPoliceSituation.lastWeek[times].value;
				//}
				self.initPoliceChart(thisWeekData);
			}
			var policeHandling=data.policeHandling.policeHandling;//警情处理
			if(policeHandling && policeHandling.length>0){
				for(var p=0;p<policeHandling.length;p++){
					var policTypeHtml="";
					if(policeHandling[p].type==10){//类型 10报警 20故障 30屏蔽 40联动
						policTypeHtml=`<div class="policeDeil-item-tt" style="color:#FA7C5A">报警</div>`;
					}else if(policeHandling[p].type==20){
						policTypeHtml=`<div class="policeDeil-item-tt" style="color:#FFBC37">故障</div>`;
					}else if(policeHandling[p].type==30){
						policTypeHtml=`<div class="policeDeil-item-tt" style="color:#A5A5A5">屏蔽</div>`;
					}else if(policeHandling[p].type==40){
						policTypeHtml=`<div class="policeDeil-item-tt" style="color:#357BCC">联动</div>`;
					}
					if(p%2==0){
						$("#policeDeil").append(`
							<div class="policeDeil-item"><div>
								`+policTypeHtml+`
								<div class="policeDeil-item-total">总数<span>`+policeHandling[p].total+`</span></div>
								<div class="policeDeil-item-num">处理数<span>`+policeHandling[p].handleNum+`</span></div>
							</div>
							</div>
						`);
					}else{
						$("#policeDeil").append(`
							<div class="policeDeil-item"><div>
								`+policTypeHtml+`
								<div class="policeDeil-item-total">总数<span>`+policeHandling[p].total+`</span></div>
								<div class="policeDeil-item-num">处理数<span>`+policeHandling[p].handleNum+`</span></div>
							</div>
							</div>
							`);
					}
				}
			}else{
				$("#policeDeil").append(`<img src="/ilink-app-h5-zd/static/img/ilink_1564368528154.png" style="width:100%;">`);
			}
			var mochaIiom=data.mochaIiom;//日常巡检
			if(mochaIiom){
				var indicator=mochaIiom.indicator;
				var isIndicator = true
				if(indicator){
					isIndicator = true
				}else{
					isIndicator = false
				}
			}
			if(data.aiResult || data.taskCompleteInfo || mochaIiom || data.controlRoom || data.personnelDuty){
				$("#dataContent").append(`
					<li class="item">
						<p class="item-tt">日常运维管理</p>
						<div class="maintainInspectView">
							<p class="policeTt"><img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;">日常巡检</p>
							<div class="maintainInspectDetail">
								<div id="maintainInspectChart" class="maintainInspectChart">
								</div>
								<div class="notFinished">
									<p class="notFinishedTt">巡检未完成</p>
									<div class="notFinishedDay"><span id="notFinishedDay"></span><label>天</label></div>
									<p class="notFinishedDec">坚持巡检，必有收获，加油！</p>
								</div>
							</div>
						</div>
						<div class="troubleView">	
							<p class="policeTt"><img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;">隐患整改</p>
							<div class="troubleDetail">
								<div class="troubleNum">
									<div>
										<span id="hideTotal"></span>
										<p>本周提报隐患</p>
									</div>
									<div style="margin-left: 9%">
										<span style="color:#2E76CA" id="hidecompleteNum"></span>
										<p>整改完成</p>
									</div>
								</div>
								<div class="pic-item" id="troublePic">
								</div>
								<div class="troubleDec">
									隐患险于明火，防范胜于救灾！
								</div>
							</div>
						</div>
						<div class="maintainView">
							<p class="policeTt"><img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;"> 维保 (本周任务完成情况)</p>
							<div class="maintainDetail" id="maintainDetail">
								<div class="maintainlegend">
									<i></i>本周完成任务<i style="background-color:rgba(153,153,153,1);margin-left: 25px;"></i>本月剩余任务
								</div>
							</div>
						</div>
						<div class="controlRoomViews">
							<p class="policeTt"><img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;"> 消控室值守</p>
							<div class="controlRoomDetail" id="controlRoomDetailData">
								<div class="roomInfo">
									<p>无人值守总时长</p>
									<span id="controlRoomTitle"></span>
								</div>
								<div id="controlRoomPic"></div>
								<p id="controlRoomDes"></p>
							</div>
						</div>
						<div class="controlRoomView">
							<p class="policeTt"><img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;"> AI云视</p>
							<div id="aiCloudVideo"></div>
						</div>
						<div class="dutyView">
							<p class="policeTt"><img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;"> 人员值班</p>
							<div class="dutyDetail">
								<div class="dutyInfo">
									<div>
										<p>正常</p>
										<span style="color:#333" id="normalView"></span>
									</div>
									<div style="margin-left: 1%">
										<p>旷工</p>
										<span style="color:#FA7C5A" id="absenteeismView"></span>
									</div>
									<div>
										<p>迟到</p>
										<span style="color:#FFBC37" id="lateView"></span>
									</div>
									<div style="margin-left: 1%">
										<p>早退</p>
										<span style="color:#FDCD73" id="lateEarlyView"></span>
									</div>
								</div>
								<div class="data-table">
								<table class="duty-table" id="dutyTable" border="0" cellpadding="0" cellspacing="0">
									<thead>
										<tr>
											<th style="text-align:left">名称</th>
											<th>正常</th>
											<th>旷工</th>
											<th>迟到</th>
											<th>早退</th>
										</tr>
									</thead>
									<tbody>
									</tbody>
								</table>
								</div>

							</div>
						</div>
					</li>
				`);
				
				
				if(indicator && indicator.length>0){
					var indicatorData=[];
					for(var m=0;m<indicator.length;m++){
						indicatorData[m]=indicator[m].value;
					}
					if(isIndicator){
						self.initMaintainChart(indicatorData);
					}
					$("#notFinishedDay").empty().html(mochaIiom.notCompleteDay);
					$("#hideTotal").empty().html(data.hideDanger.hideTotal);
					$("#hidecompleteNum").empty().html(data.hideDanger.hidecompleteNum);
					var picDangerUrls = data.hideDanger.picDangerUrls;
					$("#troublePic").empty();
					if (picDangerUrls) {
						var picList_h = picDangerUrls.split(',');
						for (var n = 0; n < picList_h.length; n++) {
							$("#troublePic").append(`<img src="` + picList_h[n] + `" data-index="${n}" />`);
						}
						if(picList_h.length==1){
							$("#troublePic").addClass('only-one-item')
						}else{
							$("#troublePic").removeClass('only-one-item')
						}
						$("#troublePic img").click((e)=>{
							var photoBrowser=app.photoBrowser.create({
								photos: picList_h,
								type: 'standalone',
								routableModals:false,
								backLinkText: 'Back',
								theme: 'dark',
								expositionHideCaptions:true,
								swipeToClose:true,
								toolbar:false,
								navbarOfText:'/'
							});
							photoBrowser.open($(e.currentTarget).data('index'))
						})
					}
				}
				// 维保（本周任务完成情况）
				if(data.taskCompleteInfo){
					var taskCompleteInfo=data.taskCompleteInfo.taskCompleteInfo;
					if(!taskCompleteInfo){
						$(".maintainView").hide()
					}else{
						if(taskCompleteInfo.length>0 && taskCompleteInfo){
							for(var t=0;t<taskCompleteInfo.length;t++){
								var completeNum=taskCompleteInfo[t].completeNum;//本周已完成数量
								var remainNum=taskCompleteInfo[t].remainNum;//本周未完成数量
								var percentNum=0;
								var total=completeNum+remainNum;
								if(total!=0){
									percentNum=completeNum/total*100;
								}
								$("#maintainDetail").append(`
									<div class="maintanSys">
										<span>`+taskCompleteInfo[t].systemName+`</span>
										<div data-progress="`+percentNum+`" class="progressbar"></div>
										<label style="color:rgba(153,153,153,1);"><a style="color:#5B96DC">`+completeNum+`</a>/`+remainNum+`</label>
									</div>
								`);
							}
						}else{
							$("#maintainDetail").append(`<img src="/ilink-app-h5-zd/static/img/ilink_1564368528154.png" style="width:100%"/>`);
						}
					}
				}else{
					$(".maintainView").hide()
				}

				if(!mochaIiom){
					$(".maintainInspectView").hide()
				}

				if(!indicator){
					$(".troubleView").hide()
				}

				if(!data.controlRoom){
					$(".controlRoomViews").hide()
				}

				if(!data.aiResult){
					$(".controlRoomView").hide()
				}
				
				var controlRoom=data.controlRoom;
				if(controlRoom){
					//消控室值守
					let hiddenDangerPics= data.controlRoom.picUrls
					if(data.controlRoom.picUrls!=""){
						var picList_c = hiddenDangerPics.split(',');
						for (var n = 0; n < picList_c.length; n++) {
							$("#controlRoomPic").append(`<img src="` + picList_c[n] + `" data-index="${n}" />`);
						}
						if(picList_c.length==1){
							$("#controlRoomPic").addClass('only-one-item')
						}else{
							$("#controlRoomPic").removeClass('only-one-item')
						}
						$("#controlRoomPic img").click((e)=>{
							var photoBrowser=app.photoBrowser.create({
								photos: picList_c,
								type: 'standalone',
								routableModals:false,
								backLinkText: 'Back',
								theme: 'dark',
								expositionHideCaptions:true,
								swipeToClose:true,
								toolbar:false,
								navbarOfText:'/'
							});
							photoBrowser.open($(e.currentTarget).data('index'))
						})
					}else{
						$("#controlRoomPic").append(`<img src="/ilink-app-h5-zd/static/img/ilink_1564368528154.png" style="width:100%"/>`);
					}
					if(controlRoom.title){
						$("#controlRoomTitle").empty().html(transNullundefinedToline(controlRoom.title));
					}else{
						$("#controlRoomTitle").empty().html(0);
					}
					if(controlRoom.desc){
						$("#controlRoomDes").empty().html(transNullundefinedToline(controlRoom.desc));
					}else{
						$("#controlRoomDes").hide();
					}
				}else{
					if(data.aiResult){
						let item = ''
						let item1 = ''
						for(let i in data.aiResult){
							item1 = ''
							if(!data.aiResult){
								$(".controlRoomView").hide()
							}else 
							if(data.aiResult[i].code == "controlRoomUse"){
								item1="<div class='bottomCloudVideoBox'><img src='../../../img/unattended_opearation.png' /><div class='bottomCloudVideo'><p>"+data.aiResult[i].typeName+"</p><p>"+self.updateNumber(data.aiResult[i].continueTimeStr)+"</p></div></div>"
							}else if(data.aiResult[i].code == "fireEscapeUse"){
								item1="<div class='bottomCloudVideoBox'><img src='../../../img/channel_occupancy.png' /><div class='bottomCloudVideo'><p>"+data.aiResult[i].typeName+"</p><p>"+self.updateNumber(data.aiResult[i].continueTimeStr)+"</p></div></div>"
							}else if(data.aiResult[i].code == "electricBicycleUse"){
								item1="<div class='bottomCloudVideoBox'><img src='../../../img/electromoblie.png' /><div class='bottomCloudVideo'><p>"+data.aiResult[i].typeName+"</p><p><span>"+data.aiResult[i].times+"</span>次</p></div></div>"
							}else if(data.aiResult[i].code == "gasCanistersUse"){
								item1="<div class='bottomCloudVideoBox'><img src='../../../img/cylinder.png' /><div class='bottomCloudVideo'><p>"+data.aiResult[i].typeName+"</p><p><span>"+data.aiResult[i].times+"</span>次</p></div></div>"
							}else{
								item1 = ''
							}
							item+=item1
						}
						$('#aiCloudVideo').append(item)
					}else{
						$(".controlRoomView").hide()
					}
				}
				
				var personnelDuty=data.personnelDuty;//人员值班
				if(!personnelDuty){
					$(".dutyView").hide()
				}else if(personnelDuty && personnelDuty.peopleWork.length>0){
					for(var p=0;p<personnelDuty.peopleWork.length;p++){
						$("#dutyTable tbody").append(`
							<tr>
								<td style="text-align:left">`+personnelDuty.peopleWork[p].watchAccountName+`</td>
								<td>`+personnelDuty.peopleWork[p].normal+`</td>
								<td style="color:#FA8768">`+personnelDuty.peopleWork[p].noWorkNum+`</td>
								<td style="color:#FFBC37">`+personnelDuty.peopleWork[p].unStartWorkNum+`</td>
								<td style="color:#FFBC37">`+personnelDuty.peopleWork[p].unEndWorkNum+`</td>
							</tr>
							`);
					}
					$("#normalView").empty().html(personnelDuty.normal);
					$("#absenteeismView").empty().html(personnelDuty.noWorkNum);
					$("#lateView").empty().html(personnelDuty.unStartWorkNum);
					$("#lateEarlyView").empty().html(personnelDuty.unEndWorkNum);
				} else {
					$("#dutyTable tbody").append(`<tr><td colspan='5'><img src="/ilink-app-h5-zd/static/img/ilink_1564368528154.png" style="width:100%"/></td></tr>`);
				}
			}

			$('#sharePageBtn').click(function(){
				shareReport(document.location.href,orgName,startTimeStr+"-"+endTimeStr+"消防报表");			
			});

			$('#voiceBtn').click(function(){
				//还没播放
				if(!isPlay){
					if(data.reportDesc){
						Voice.play(data.reportDesc, function () {
							isPlay = true;
							$('#voiceBtn').attr("src", "../../../img/voice.gif");
						},function(){
							isresume = true;
							$('#voiceBtn').attr("src", "../../../img/voice.png");
							Voice.pause();
						});
					}else{
						try {
							top.window.app.methods.showToastCenter("未找到语音文件");
						} catch (error) {
						}
					}
				}
				//已经播放-暂停
				else if(!isresume){
					isresume = true;
					$('#voiceBtn').attr("src", "../../../img/voice.png");
					Voice.pause();
				}
				//暂停中-继续播放
				else{
					isresume = false;
					$('#voiceBtn').attr("src", "../../../img/voice.gif");
					Voice.resume();
				}
			});
    	} else {
    		//$("").append();
    	}
        }
	})
});
	// 截取字符串中的数字并添加span标签
	function updateNumber(str){
	    var output = [];
	    for(var i = 0, iLen = str.length; i < iLen; i++){
	        if(str[i].match(/\d/)){
	            output.push('<span>'+str[i] + '</span>');
	        }else{
	            output.push(str[i]);
	        }
	    }
	    return output.join('');
	}
		//初始化安全表
		function initSecurityChars(data){
			for(var week=0;week<7;week++){
				$("#securityChars").append(`
					<div class="chartLineView">
						<div class="item-hour" id="item-`+week+`">
						</div>
						<p id="weekDay`+week+`">周一</p>
					</div>
				`);
				for(var hour=24;hour>0;hour--){
					$("#item-"+week).append(`
							<div id="item-`+week+`-`+hour+`"></div>
					`);
				}
				switch(week){
					case 0:$("#weekDay"+week).html("周一"); break;
					case 1:$("#weekDay"+week).html("周二"); break;
					case 2:$("#weekDay"+week).html("周三"); break;
					case 3:$("#weekDay"+week).html("周四"); break;
					case 4:$("#weekDay"+week).html("周五"); break;
					case 5:$("#weekDay"+week).html("周六"); break;
					case 6:$("#weekDay"+week).html("周日"); break;
				}
			}
			if(data && data.length>0){
				for(var i=0;i<data.length;i++){
					if(data[i].type==1){//1：告急;
						$("#item-"+data[i].week+"-"+data[i].time).attr("style", "background-color:#FA7B59");
					}else{//2.危险
						$("#item-"+data[i].week+"-"+data[i].time).attr("style", "background-color:#FFBC37");
					}
				}
			}
		}

		function initPieChart(value,viewId,color) {
			let myChart = echarts.init(document.getElementById(viewId));
			let option = {
				color: [color, '#F1F1F1'],
				series: [{
					name: '',
					type: 'pie',
					radius: ['90%', '100%'],
					center: ['50%', '50%'],
					avoidLabelOverlap: false,
					label: {
						normal: {
							show: false,
							position: 'center'
						},
						emphasis: {
							show: true,
							textStyle: {
								fontSize: '30',
								fontWeight: 'bold'
							}
						}
					},
					labelLine: {
						normal: {
							show: false
						}
					},
					data: [{
							value: value,
							name: ''
						},
						{
							value: 100 - value,
							name: ''
						},
					]
				}]
			};
			myChart.setOption(option, true);
		}
			
		function initPoliceChart(thisWeek){
			let myChart = echarts.init(document.getElementById('policeChart'));
			let option = {
					tooltip : {
						trigger: 'axis',
						axisPointer: {
							//type: 'cross',
							label: {
								backgroundColor: '#6a7985'
							},
						}
					},
					grid: {
						left: '4%',
						right: '4%',
						bottom: '20%',
						containLabel: false
					},
					xAxis : [
						{
							type : 'category',
							boundaryGap : false,
							data : ['周一','周二','周三','周四','周五','周六','周日'],
							axisLabel: {
								show: true,
								textStyle: {
									color: '#999999'
								},
								
							},
							axisLine:{
								lineStyle:{
									color:'#999999',
									width:1,//这里是为了突出显示加上的
								}
							}
						}
					],
					yAxis : [
						{
							type : 'value',
							show : false,
							minInterval: 1, //设置成1保证坐标轴分割刻度显示成整数。
							axisLabel: {
					            formatter: '{value}'
					        }
						}
					],
					series : [
						{
							name:'数量',
							type:'line',
							stack: '总量',
							smooth:true,
							itemStyle: {  
								normal: {   //颜色渐变函数 前四个参数分别表示四个位置依次为左、下、右、上
									color: new echarts.graphic.LinearGradient(0, 0, 0, 1,[{
											offset: 0, color: '#D0D7FF' // 0% 处的颜色
										}, {
											offset: 0.5, color: '#D0D7FF' // 50% 处的颜色
										}, {
											offset: 1, color: '#D0D7FF' // 100% 处的颜色
										}]
									),  //背景渐变色 
									lineStyle: {        // 系列级个性化折线样式  
										width: 0,  
										type: 'solid',  
										color: "#D0D7FF"
									}
								},  
								emphasis: {  
									color: '#D0D7FF',  
									lineStyle: {        // 系列级个性化折线样式  
										width:0,  
										type: 'dotted',  
										color: "#D0D7FF" //折线的颜色
									}  
								}  
							},//线条样式  
							symbolSize:0, //折线点的大小
							areaStyle: {normal: {}},
							data:thisWeek
						}
					]
				};
			myChart.setOption(option, true);
		}
		function initMaintainChart(data){
			let myChart = echarts.init(document.getElementById('maintainInspectChart'));
			let dayBox = [{ name: '周一', max: 100 },
				{ name: '周二', max: 100 },
				{ name: '周三', max: 100 },
				{ name: '周四', max: 100 },
				{ name: '周五', max: 100 },
				{ name: '周六', max: 100 },
				{ name: '周日', max: 100 },]
			let	option = {
					tooltip: {
						//trigger: 'axis',
						formatter: function (params) {
							let _html ='完成百分比</br>'
							$.each(params.value,(index,obj)=>{
								_html+=(dayBox[index].name+"："+obj+"%</br>")
							})
							return _html
						}
					},
					radar: {
						// shape: 'circle',
						name: {
							textStyle: {
								color: '#666',
								fontSize:8,
						}
						},
						indicator: dayBox,
						radius: 50,
						startAngle: 90,
						splitNumber: 5,
						axisLine: {
							lineStyle: {
								color: '#e1e1e1'
							}
						},
						splitLine: {
							lineStyle: {
								color: '#e1e1e1'
							}
						}
					},
					series: [{
						name: '雷达图',
						type: 'radar',
						lineStyle: {
							normal: {
								color:'#2E76CA'
							}
						},
						label: {
							normal: {
								show: false,
							}
						},
						itemStyle: {
							emphasis: {
								// color: 各异,
								lineStyle: {
									width: 1
								}
							}
						},
						areaStyle: {normal: {
							opacity: 0.4,
							color: '#2E76CA',
						}},
						symbolSize:0, //折线点的大小
						data : [
							{
								value : data,
								name : '完成百分比'
							}
						]
					}]
				};
			myChart.setOption(option, true);
			
		}
 
		transNullundefinedToline=function(a){
			if(a==null||a==undefined||a==""){
				return "-";
			}else{
				return a;
			}
		}

		//只能分享一次
		//后面优化成h5
		function shareReport(url,shareTitle,shareContent){
			parent.native.shareReport(decodeURIComponent(url),shareTitle,shareContent);
		}
		
		function xxbubs(str) {
			str=str.replace("f6ae12c1671b4ce48c3f90e9dd9d7608","");
			return decodeURIComponent(atob(str).split('').map(function(c) {
				return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
			}).join(''));
		}

		function getQueryVariable(variable){
			var query = window.location.search.substring(1);
			var vars = query.split("&");
			for (var i=0;i<vars.length;i++) {
				var pair = vars[i].split("=");
				if(pair[0] == variable){return pair[1];}
			}
			return(false);
		}

</script>
</body>
</html>
